.le-editor-toolbar {
  width: 100%;
  background: #fff;
  z-index: 10;
  text-align: left;
  border-bottom: 1px solid #e6e8ea;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 0;
  -webkit-flex: none;
  -ms-flex: none;
  flex: none;
  flex-wrap: nowrap;
}

.le-editor-tools {
  padding: 0;
  margin: 0;
  list-style: none;
  margin-left: 5px;
  display: flex;
  flex-wrap: nowrap;
}

.le-left-tools{
  flex-wrap: wrap;
}

.le-editor-tools>li {
  margin: 0;
  padding: 4px;
  display: inline-block;
  position: relative;
}

.le-editor-tools>li.divider {
  display: inline-block;
  text-indent: -9999px;
  height: 20px;
  padding: 2px;
  margin-top: 4px;
  border-right: 1px solid #ddd;
}

.le-editor-tools>li>a {
  outline: 0;
  color: #666;
  display: inline-block;
  min-width: 24px;
  font-size: 16px;
  text-decoration: none;
  text-align: center;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
  border-radius: 2px;
  border: 1px solid #fff;
  transition: all 300ms ease-out;
}

.le-editor-tools>li+li>a {
  margin-left: -3px;
}

.le-editor-tools>li>a:hover {
  border: 1px solid #ddd;
  border-radius: 5px;
  background: #eee;
}

.le-editor-tools>li>a:hover, .le-editor-tools>li>a {
  -webkit-transition: all 300ms ease-out;
  -moz-transition: all 300ms ease-out;
}

.fa {
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
}

.le-editor-tools .fa {
  text-align: center;
  display: block;
  padding: 5px;
}

.le-editor-tools .tools-bold {
  padding: 5px 2px;
  display: inline-block;
  font-weight: 700;
}

/* 弹出框样式 */
.le-editor-toolbar .slide-fade-enter-active {
  -webkit-animation:fadeInLeft .5s .2s ease both;
  -moz-animation:fadeInLeft .5s .2s ease both;}
  @-webkit-keyframes fadeInLeft{
  0%{opacity:0;
  -webkit-transform:translateX(-20px)}
  100%{opacity:1;
  -webkit-transform:translateX(0)}
  }
  @-moz-keyframes fadeInLeft{
  0%{opacity:0;
  -moz-transform:translateX(-20px)}
  100%{opacity:1;
  -moz-transform:translateX(0)}
}
.le-editor-toolbar .slide-fade-leave-active {
  -webkit-animation:fadeOutLeft .5s .2s ease both;
  -moz-animation:fadeOutLeft .5s .2s ease both;}
  @-webkit-keyframes fadeOutLeft{
  0%{opacity:1;
  -webkit-transform:translateX(0)}
  100%{opacity:0;
  -webkit-transform:translateX(-20px)}
  }
  @-moz-keyframes fadeOutLeft{
  0%{opacity:1;
  -moz-transform:translateX(0)}
  100%{opacity:0;
  -moz-transform:translateX(-20px)}
}

.le-editor-toolbar .modal{
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}

.le-editor-toolbar .dropbox {
  height: 240px;
  width: 430px;
  color: #666;
  position: absolute;
  z-index: 99999;
  display: block;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  -ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  background: #fff;
  font-size: 14px;
  top: 15%;
  left: 35%;
  margin: 0 auto;
}

.le-editor-toolbar .dialog-header {
  padding: 11px 20px;
  border-bottom: 1px solid #eee;
  -webkit-transition: background 300ms ease-out;
  -moz-transition: background 300ms ease-out;
  transition: background 300ms ease-out;
}

.le-editor-toolbar .dialog-close {
  position: absolute;
  top: 12px;
  right: 15px;
  font-size: 18px;
  color: #ccc;
  -webkit-transition: color 300ms ease-out;
  -moz-transition: color 300ms ease-out;
  transition: color 300ms ease-out;
}

.le-editor-toolbar .dialog-close a {
  text-decoration: none;
}
.fa {
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform: translate(0, 0);
  color: #8a8383;
}
.le-editor-toolbar .dialog-container {
  position: relative;
  padding: 20px;
  line-height: 1.4;
}
.le-editor-toolbar .dialog-form {
  color: #666;
}

.le-editor-toolbar .dialog-form label {
  float: left;
  display: block;
  width: 16%;
  text-align: left;
  padding: 7px 5px 15px 0;
  margin: 0 0 2px;
  font-weight: 400;
}

.le-editor-toolbar .dialog-form input[type="text"] {
  display: inline-block;
  width: 81%;
}
.le-editor-toolbar .dialog-form input[type="text"],
.le-editor-toolbar .dialog-form input[type="number"] {
  color: #999;
  padding: 8px 2px;
  border: 1px solid #ddd;
}

.le-editor-toolbar .dialog-footer {
  padding: 10px 0 0;
  text-align: right;
  width: 100%;
}

.le-editor-toolbar .dialog-container .dialog-btn,
.le-editor-toolbar .dialog-footer .dialog-btn,
.le-editor-toolbar .dialog-form .dialog-btn {
  color: #666;
  min-width: 75px;
  cursor: pointer;
  background: #fff;
  padding: 7px 10px;
  border: 1px solid #ddd;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  -webkit-transition: background 300ms ease-out;
  -moz-transition: background 300ms ease-out;
  transition: background 300ms ease-out;
}

.le-editor-toolbar .dialog-form .fa-btns {
  display: inline-block;
}

.le-editor-toolbar .dialog-form .fa-btns label {
  float: none;
  display: inline-block;
  width: auto;
  text-align: left;
  padding: 0 0 0 5px;
  cursor: pointer;
}
.le-editor-toolbar a:-webkit-any-link {
  cursor: pointer;
  text-decoration: none;
}
.le-editor-toolbar .dialog-form .fa-btns a {
  color: #999;
  padding: 7px 10px 0 0;
  display: inline-block;
  text-decoration: none;
  text-align: center;
}

.le-editor-toolbar .dropdown {
  position: relative;
  display: inline-block;
}

/* 下拉内容 (默认隐藏) */
.le-editor-toolbar .dropdown-content {
  position: absolute;
  background-color: #f9f9f9;
  height: 260px;
  overflow-y: scroll;
  width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

/* 下拉菜单的链接 */
.le-editor-toolbar .dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

/* 鼠标移上去后修改下拉菜单链接颜色 */
.le-editor-toolbar .dropdown-content a:hover{background-color: #f1f1f1}
.le-editor-toolbar .dropdown-content .current-skin {background-color: #e3e3e3}

/* 在鼠标移上去后显示下拉菜单 */
.le-editor-toolbar .dropdown:hover .dropdown-content {
  display: block;
}

/* 当下拉内容显示后修改下拉按钮的背景颜色 */
.le-editor-toolbar .dropdown:hover .dropbtn {
  background-color: #3e8e41;
}

@media (max-width: 800px) {
  .le-head-tools,.le-align-tools{
    display: none !important;
  }
}
